@import "../../../../common/stylus/theme.styl";

.side-bar
  position fixed
  top $mobile-header-height
  left 0
  bottom 0
  padding 20px 10px 20px 20px
  background-color #f9f9f9
  transition all .4s cubic-bezier(0.4, 0, 0, 1)
  transform translate(-280px, 0)
  overscroll-behavior contain
  overflow-x hidden
  overflow-y auto
  -webkit-overflow-scrolling touch
  -ms-overflow-style none
  z-index 13
  &.open
    transform translate(0, 0)
  .site-name
    font-size 1.5em
    margin-bottom 20px
  .sidebar-inner
    box-sizing border-box
    .search-query
      width 200px
      margin-bottom 10px
    .site-nav
      display inline-block
      font-size 16px
      height 52px
      line-height 32px
      padding 10px 0
    .nav-menu
      display block
      margin-bottom 20px
      padding-left 10px
      transition height 0.7s
      height auto
      overflow hidden
      &.hide
        max-height 0
  ul
    list-style-type none
    margin 0
    line-height 1.5em
    padding-left 0.7em
  li
    margin .5em 0
    > a
      font-size 16px
      color $color-gradually-gray-21
      &:hover, &.active
        color $color-main-primary
    > ul > li > a
      font-size 14px
      color $color-gradually-gray-51
  .nav-link
    text-decoration none
    &:hover, &.active
      text-decoration underline
      color $color-main-primary

  // 生成Toc目录css
  .menu-root
    margin-top 30px



